<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path;
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="<%=basePath %>/resource/layui/css/layui.css">
<link rel="stylesheet" href="<%=basePath %>/resource/css/commons.css">
<title>大旗科技有限公司</title>
<style type="text/css">
	body {
		padding: 10px;
	}
	.layui-form {
		padding: 2px;
	}
	
	#problem-detail {/*自动换行显示*/
		overflow: hidden;
	    text-overflow: ellipsis;
	    word-break: break-all;
	}

	.layui-elem-field legend {
		font-size: 15px;
	}

</style>
</head>
<body>
	<fieldset class="layui-elem-field">
		<legend>问题描述</legend>
		<div class="layui-field-box">
			<pre id="problem-detail"></pre>
		</div>
	</fieldset>
	<form class="layui-form layui-form-pane">
		<input type="hidden" name="problemId" value=""/>
	    <div class="layui-form-item">
	    	<label class="layui-form-label">反馈状态</label>
		    <div class="layui-input-block">
		      <select name="problemState" lay-verify="required">
		         <option value="等待处理">等待处理</option>
	   		     <option value="处理中">处理中</option>
	   		     <option value="处理完成">处理完成</option>
		      </select>
		    </div>
		</div>
	    <div class="layui-form-item layui-form-text">
			<label class="layui-form-label">回复内容</label>
			<div class="layui-input-block">
				<textarea name="problemReply" class="layui-textarea"></textarea>
			</div>
		</div>
		<%@include file="/admin/commonsPage/submit-reset.html" %>
	</form>
	<script type="text/javascript" src="<%=basePath %>/resource/js/jquery-2.1.0.min.js"></script>
	<script type="text/javascript" src="<%=basePath %>/resource/layui/layui.js"></script>
	<script type="text/javascript">
		//回复的同时也相当于更新,之前有的值也要相应的回现回来
		var selectedRow = parent.cTable.bootstrapTable('getSelections');
		
		$("[name='problemId']").val(selectedRow[0].problemId);
		$("#problem-detail").text(selectedRow[0].problemDetail);
		$("[name='problemReply']").text(selectedRow[0].problemReply);
		$("[value='"+selectedRow[0].problemState+"']").attr("selected",true);
		
		layui.use(['form','layer'],function(){
			var form = layui.form;
			var layer = layui.layer;
			form.render(); //更新全部
			form.on('submit(submitForm)', function(data){
				var layerIndex;
				$.ajax({
				   type: "PUT",
				   url: "<%=basePath %>/problem-feedback/reply",
				   data: data.field,
				   beforeSend: function () {
					   layerIndex = layer.load(2);
		           },
				   statusCode : {
					   201: function(){
						   layer.alert('回复成功!', {
							   title:"提示信息"
						       ,skin: 'layui-layer-lan'
						       ,closeBtn: 0
						       ,anim: 0 //动画类型
						       ,icon: 1
						   }, function(index){
							   layer.close(index);
							   parent.layer.close(parent.layer.getFrameIndex(window.name));
							   parent.cTable.bootstrapTable('refresh');
						   });
					   },
					   400: function(){
						   layer.alert('回复失败!', {
							   title:"提示信息"
						       ,skin: 'layui-layer-lan'
						       ,closeBtn: 0
						       ,anim: 0
						       ,icon: 0
						   });
					   },
					   500: function(){
						   layer.alert('服务器繁忙!', {
							   title:"提示信息"
						       ,skin: 'layui-layer-lan'
						       ,closeBtn: 0
						       ,anim: 0
						       ,icon: 2
						   });
					   }
				   },
				   complete: function(){
					   layer.close(layerIndex);
				   }
				});
			    return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
		})
	</script>
</body>
</html>